.sp-index {

	&__ {

		&swiper {
			padding: 0 24rpx 36rpx;
			.back-color(#fff);
		}

		&nav {
			padding: 0 24rpx 8rpx;
			.f-center-space();
			flex-wrap: wrap;
			.back-color(#fff);
			.boxing();

			&-item {
				.size(330, 150);
				margin-bottom: 28rpx;

				image {
					display: block;
					width: 100%;
					height: 100%;
				}
			}
		}

		&menu {
			.f-center-space();
			.back-color(#fff);
			padding: 0 0 46rpx;

			&-item {
				flex: 1;

				image,
				text {
					display: block;
				}

				image {
					.square(128);
					margin: 0 auto;
				}

				text {
					margin: -6rpx auto 0;
					.font(28, 28, #666);
				}
			}
		}

		&grid {
			margin-top: 20rpx;
			.back-color(#fff);
			.flex();
			flex-wrap: wrap;
			padding: 46rpx 0 18rpx;

			&-item {
				flex: 0 0 25%;
				margin-bottom: 28rpx;

				image,
				text {
					display: block;
				}

				image {
					.square(106);
					margin: 0 auto 6rpx;
				}

				text {
					.font(26, 36, #666);
				}
			}
		}

		&message {
			.size(702, 120);
			margin: 40rpx auto 15rpx;
			.radius(20);
			.shadow(0px 0px 10rpx 0px rgba(0,0,0,0.06));
			background: #fff url('@{cdn}index/depart.png') right top no-repeat;
			background-size: 245rpx 95rpx;

			&- {

				&item {
					width: 430rpx;
					margin-left: 30rpx;
					background: url('@{cdn}member/arrow.png') right no-repeat;
					background-size: 26rpx;
					padding: 35rpx 0;
					.font(32, 50, #666, left);
				}

				&type1 {
					color: #FF811E;
				}
			}
		}

		&doctor {}

		&order{
			padding: 24rpx;
			&-{
				&item{
					padding: 0 24rpx 8rpx;
					margin-top: 24rpx;
					background: linear-gradient(180deg, #EFF5FF 0%, #FFFFFF 100%);
					box-shadow: 0px 0px 10rpx 0px rgba(0,0,0,0.06);
					.radius(20);
					
					&-{
						&head {
							.flex();
							height: 94rpx;
							border-bottom: 1px solid #efefef;
							background: url('@{cdn}index/report.png') left center no-repeat;
							background-size: 64rpx 53rpx;
							
							label{
								display: block;
								.font(32, 86, #222, left);
								padding-left: 74rpx;
							}
							
							text{
								display: block;
								margin-left: 14rpx;
								.font(28, 86, #6582F9, left);
							}
						}
						&body{
							padding-top: 24rpx;
							view{
								.font(28, 40, #666, left);
								margin-bottom: 16rpx;
								text{
									margin-right: 24rpx;
								}
							}
						}
					}
				}
			}
		}
		
		// 选择院区
		&part {
			padding: 24rpx;
			
			&- {
				
				&item {
					.flex();
					.back-color(#fff);
					.boxing();
					.radius(20rpx);
					background: url('@{cdn}team/arrow-gray.png') 652rpx 46rpx no-repeat;
					background-size: 26rpx;
					padding: 24rpx;
					margin-bottom: 24rpx;
					
					image {
						display: block;
						.square(120);
						.back-color(#F6F6F6);
						.radius(10rpx);
					}
				}
				
				&info {
					flex: 1;
					margin-left: 24rpx;
					
					label {
						display: block;
						margin-bottom: 10rpx;
						.font(32, 46, #222, left);
					}
					
					text {
						.font(28, 40, #666, left);
						.text-overflow-one();
					}
				}
			}
		}
		
		// 报到-就诊人详情
		&patient {
			padding: 24rpx;
			
			&- {
				
				&header,
				&boxes {
					margin-bottom: 24rpx;
					padding: 24rpx;
					.back-color(#fff);
					.radius(20rpx);
				}
				
				&header {
					.flex();
					
					image {
						.square(86);
						margin-right: 24rpx;
					}
				}
				
				&info {
					
					text {
						.font(28, 40, #666, left);
					}
				}
				
				&name {
					margin-bottom: 6rpx;
					text {
						padding-left: 20rpx;
					}
					
					label {
						.font(28, 40, #222, left);
					}
				}
				
				&title {
					.flex();
					
					image,
					text {
						display: block;
					}
					
					image {
						.square(38);
						margin: 10rpx;
					}
					
					text {
						.font(30, 42, #222, left);
					}
				}
				
				&desc {
					margin-top: 10rpx;
					.font(28, 40, #666, left);
				}
			}
		}
	}
}

.sp-sign {
	padding: 24rpx;
	
	.sp-button {
		.size(610, 80);
		.font(32, 80, #fff);
		margin: 100rpx auto 0;
	}
	
	&__ {
		
		&title {
			padding: 24rpx 0;
			.font(30, 42, #222, left);
		}
		
		&header {
			.flex();
			.back-color(#fff);
			.radius(20rpx);
			width: 702rpx;
			margin: 0 auto 24rpx;
			
			image {
				display: block;
				.square(120);
			}
		}
		
		&service {
			width: 702rpx;
			margin: 0 auto;
			padding: 0 24rpx 24rpx;
			.back-color(#fff);
			.boxing();
		}
		
		&desc {
			.font(28, 40, #666, left);
		}
		
		&patient {
			
			&- {
				
				&list {}
				
				&item {
					position: relative;
					.size(702, 165);
					.back-color(#fff);
					.radius(20rpx);
					.boxing();
					margin: 0 auto 24rpx;
					border-top: 10rpx solid #6582F9;
					padding: 24rpx;
					
					& > text {
						position: absolute;
						top: 50%;
						transform: translateY(-50%);
						right: 24rpx;
						padding-right: 32rpx;
						.font(28, 40, #6582F9, left);
						background: url('@{cdn}team/arrow-blue.png') right center no-repeat;
						background-size: 24rpx;
					}
				}
				
				&name {
					margin-bottom: 18rpx;
					
					label {
						.font(32, 45, #222, left);
						margin-right: 18rpx;
					}
				}
			}
		}
	}
}
